<div class="col-lg-6">
    <div class="panel panel-default">
        <div class="panel-body" style = "background: #CEE3F6">
			<div class="col-xs-12"><h2>Nueva Asignatura</h2><br/><br/></div>
			<div class="col-xs-12">	
				<form id ="myForm" role="form" action="insertar_registro.php" onsubmit="return validar()" method="post">
					<div class="form-group col-xs-12">
						<label>Nombre&nbsp;<span class="glyphicon glyphicon-asterisk" style="font-size: 0.5em;"/></label>
						<input type="text" class="form-control" name="nombre" required>
					</div>
					<div class="col-xs-12"></div>
					<div class="form-group col-xs-3" id="codigo">
						<label>Código&nbsp;<span class="glyphicon glyphicon-asterisk" style="font-size: 0.8em;"/></label>
						<input type="text" min = "0" class="form-control col-xs-6 has" name="codigo" required>
					</div>
					<div class="form-group col-xs-9">
						<label>Tipo&nbsp;<span class="glyphicon glyphicon-asterisk" style="font-size: 0.8em;"/></label>
						<select class="form-control"name ="tipo" required>
							<option></option>
							<option>Obligatoria</option>
							<option>Electiva</option>
							<option>Optativa</option>
							<option>Complementaria</option>
						</select>
					</div>
					<div class="col-xs-12"></div>
					<div class="form-group col-xs-3" id="creditos">
						<label>Créditos&nbsp;<span class="glyphicon glyphicon-asterisk" style="font-size: 0.8em;"/></label>
						<input type="number" min="1" max="6" value="1" class="form-control" name="creditos" required>
					</div>
					<div class="form-group col-xs-9">
						<label>Opción Profesional&nbsp;<span class="glyphicon glyphicon-asterisk" style="font-size: 0.8em;"/></label>
						<select class="form-control"name ="profesional" required>
							<option></option>
							<option>Ciclo Básico</option>
							<option>Aplicaciones con la Tecnología Internet</option>
							<option>Base de Datos</option>
							<option>Cálculo Científico y Tecnológico</option>
							<option>Computación Gráfica</option>
							<option>Computación Paralela y Distribuida</option>
							<option>Ingeniería del Software e Interacción Humano-Computador</option>
							<option>Inteligencia Artificial</option>
							<option>Laboratorio General</option>
							<option>Modelos y Programación Matemática</option>
							<option>Sistemas de Información</option>
							<option>Tecnologías Educativas</option>
							<option>Tecnologías en Comunicación y Redes de Computadora</option>
						</select>
					</div>
					<div class="col-xs-12"></div>
					<div class="form-group col-xs-3">
						<label>Semestre</label>
						<select class="form-control"name ="semestre">
							<option></option>
							<option>I</option>
							<option>II</option>
							<option>III</option>
							<option>IV</option>
							<option>V</option>
							<option>VI-IX</option>
							<option>VII-IX</option>
							<option>VIII-IX</option>
						</select>
					</div>
					<div class="form-group col-xs-9">
						<label>Centro de Investigación</label>
						<select class="form-control" name ="centro">
							<option></option>
						</select>
					</div>
					<div class="col-xs-12"></div>
					<div class="form-group col-xs-8">
			          	<label>Ofertada&nbsp;<span class="glyphicon glyphicon-asterisk" style="font-size: 0.8em;"/></label>
			          	<div>
							<input type="radio" name="ofertada" value="Si" checked>&nbsp;Si &nbsp;&nbsp;&nbsp;
							<input type="radio" name="ofertada" value="No">&nbsp;No
						</div>
					</div>
					<div class="form-group col-xs-4">
			          	</br><label><span class="glyphicon glyphicon-asterisk" style="font-size: 0.8em;"/>&nbsp;Campos obligatorios</label>
					</div>
					<div class="col-xs-12"></br></div>
					<div class="col-xs-4"></div>
					<div class="col-xs-4">	
						<button type="submit" id="agregar" class="btn btn-primary form-control">Agregar</button>
					</div>
					<div class="col-xs-4"></div>
					<div class="col-xs-12"></br></div>
					<input type="hidden" name="tabla" value="asignatura">
				</form>
			</div>	
   	 	</div>
	</div>
</div>

<script>
$('[name=codigo]').keyup(function (e) {
	var code = $(this).val(); 
	if(/^[0-9]+$/.test(code) && code >= 0 && code < 10000){
		$.post('validaciones.php', {'codigo':code}, function(data) {
			if(data=='NO'){$("#codigo").addClass("has-error");}
			else $("#codigo").removeClass("has-error");
		});
	}
	else $("#codigo").addClass("has-error");

});

$.ajax({type:"POST",url:"cargar_centros.php",success:function(result){$("[name=centro]").html(result);}});

$('[name=creditos]').keyup(function (e) {
	if($('[name=creditos]').val() < 1 || $('[name=creditos]').val() > 6) {$("#creditos").addClass("has-error");}
	else $("#creditos").removeClass("has-error");
});

function validar()
{
	var code = $('[name=codigo]').val();
	if(!(/^[0-9]+$/.test(code) && code >= 0 && code < 10000)) alert("Uno o más campos inválidos!\nVerífiquelos antes de continuar.");
	return (/^[0-9]+$/.test(code) && code >= 0 && code < 10000);
}


</script>